import { Button, NavBar } from 'antd-mobile'
import React from 'react'
import { useSelector } from 'react-redux'
import { useNavigate } from 'react-router-dom'
import request from "../../api/request";

function Detail() {
    const navigate=useNavigate();
    const detailList=useSelector(state=>state.detail.detailList)
    console.log(detailList)
    const handleSend=async()=>{
        const res=await request.get('/pay',{
            params:{
                title:"车票",
                id:new Date().getTime(),
                price:detailList.price
            }
        })
        console.log(res.data.data)
        window.open(res.data.data)
        navigate('/success')
    }
  return (
    <div>
      <NavBar onBack={()=>navigate(-1)}>详情</NavBar>
      <div style={{marginLeft:"10px", borderBottom:"1px solid #ccc", display:"flex", padding:"10px"}}>
        <h3>
            <span>{detailList.start}---{detailList.end}</span>
        </h3>
        <div style={{marginLeft:"30px"}}>
            <span style={{color:"red"}}>￥{detailList.price}</span>
            <br></br>
            <span>{detailList.type}</span>
        </div>
        <Button onClick={()=>handleSend()} style={{marginLeft:"120px"}}>预定</Button>
      </div>
    </div>
  )
}

export default Detail
